/***依赖jquery，简单的弹出框，支持iframe和ajax-div，动态设值button。没有用jquery插件机制*/

// Add semicolon to prevent IIFE from being passed as argument to concatenated code.
;
// UMD (Universal Module Definition)
// see https://github.com/umdjs/umd/blob/master/returnExports.js
(function (root, factory) {
    /* global define, exports, module */
    if (typeof define === 'function' && define.amd) {
        // AMD. Register as an anonymous module.
        define(factory);
    } else if (typeof exports === 'object') {
        // Node. Does not work with strict CommonJS, but
        // only CommonJS-like enviroments that support module.exports,
        // like Node.
        module.exports = factory();
    } else {
        // Browser globals (root is window)
        root.PopBox = factory();
  }
}(this, function () {
    var PopBox=function(config){
         
        $.extend(true,this,PopBox.DEFAULT);
        $.extend(true,this,config);
         
        PopBox.idIndex++;
        this.id='popbox-'+PopBox.idIndex;
        !this.$parent&&(this.$parent=$('body'));
        this.btnFuns={};
         
        this.init();
    };
    PopBox.DEFAULT={
        mode:'iframe'      
    };
    PopBox.idIndex=0;
    PopBox.templateIframe='<iframe  border=0 align="middle" FRAMEBORDER=0 marginheight=0 '+
                        'marginwidth=0  scrolling="auto"  width="100%" ></iframe>';
    PopBox.template='<div class="popbox-container">'+
        '<div class="popbox-mask"></div>'+
        '<div  class="popbox-box">'+
        '   <h2 class="popbox-header"></h2>'+
        '   <div class="popbox-close"></div>'+
        '   <div class="popbox-body">'+
        '   </div>'+
        '<div class="popbox-btns"></div>'+
        '</div>'+
    '</div>';
    PopBox.classes=['popbox-container','popbox-mask','popbox-box','popbox-header','popbox-close','popbox-body','popbox-btns'];
    PopBox.prototype={
        render:function(){
            var $div=$('<div>'+PopBox.template+'</div>'),
                that=this;
            this.$div={};
            $.each(PopBox.classes,function(index,clsName){
                var $ele=$('.'+clsName,$div);
                that.$div[clsName]=$ele;
                that['css-'+clsName]&&$ele.css(that['css-'+clsName]);
            });
            if(this.mode=='iframe')
            {
                this.$div['popbox-body'].append(PopBox.templateIframe);
                this.$iframe=$('iframe',this.$div['popbox-body']);
            }
            //渲染button
            this.setButtons(this.buttons);
             
            this.$div['popbox-container'].attr('id',this.id);
            this.$div['popbox-header'].html(this.title)
            this.$parent.append(this.$div['popbox-container']);
        },
        setButtons:function(buttons){
            this.buttons=buttons;
            this.btnFuns={};
            var $btns=this.$div['popbox-btns'],btnHtml=[],that=this;
            $btns.empty();
             
            this.buttons&&$.each(this.buttons,function(index,btn){
                btnHtml.push('<input type="button" id="popbox-btn-'+btn.code+'" value="'+btn.name+'" class="btn">');
                that.btnFuns[btn.code]=btn.onclick;
            });
            $btns.append(btnHtml.join(''));
        },
        bind:function(){
            var that=this;
            this.$div['popbox-close'].on('click',function(){
                that.close();
            });
            this.$div['popbox-btns'].on('click','.btn',function(e){
                var fun=that.btnFuns[this.id.split('popbox-btn-')[1]];
                fun&&fun(e);
            });
        },
        sync:function(){
            this.url&&this.load();
        },
        close:function(){
            this.$div['popbox-container'].css('display','none');
        },
        show:function(){
            var $btns=this.$div['popbox-btns'],
                height=this.$div['popbox-box'].height()-this.$div['popbox-header'].height();
             
            if(this.buttons)
            {
                $btns.css('display','block');
                height-=$btns.height();
            }   
            else
                $btns.css('display','none');
             
            this.$iframe.attr('height',height);
            this.$div['popbox-container'].css('display','block');
        },
        load:function(url,title){
            this.url=url=url||this.url;
            this.title=title=title||this.title;
             
            if(this.mode=='iframe')
                this.$iframe.attr('src',url);
            else
                this.$div['popbox-body'].load(url);
            title&&this.$div['popbox-header'].html(title);
            this.title=title;
            this.show();
        },
        init:function(){
            this.render();
            this.bind();
            this.sync();
        }
    };
    return PopBox;
}));
/***
 * demo1:
 *     var popBox=new PopBox({
 *          title:'资源查询',
 *          'css-popbox-box':{width:'70%'}
 *     });
 *     popBox.load('http://localhost.fjsq.org/resInfo/main.jhtml');
 *     
 * demo2:
 *      var popBox=new PopBox({
 *              title:'资源查询',
 *              url:'http://localhost.fjsq.org/resInfo/main.jhtml',
 *              'css-popbox-box':{width:'70%',height:500}
 *          });
 *      popBox.setButtons([{
 *                  code:'apply',
 *                  name:'申请',
 *                  onclick:function(event){
 *                      popBox.setButtons();
 *                  }
 *              }]);
 * 
 * config={
 *      $parent:父节点的$
 *      mode:'iframe'|'div',
 *      title:xxx,
 *      buttons:[{
 *          code:''
 *          name:'',
 *          onclick:function(event){
 *  
 *          }
 *      }],
 *      url:
 *      css-popbox-container:{}
 *      css-popbox-mask:{}
 *      css-popbox-box:{}
 *      css-popbox-header:{}
 *      css-popbox-close:{}
 * }
 */



 .popbox-container{
    position:fixed;
    top:0;bottom:0;left:0;right:0;
    z-index:200;    
    display: none;
}
 
.popbox-btns{
    height:50px;
    text-align: center;
    background:#f5f5f5; 
    border-top:1px solid #cfcece;
}
 
.popbox-btns .btn{
    margin:10px;
    width: 140px;
    height: 30px;
    display: inline-block;
    background: #2d73cd;
    border-radius: 2px;
    color: #fff;
    border: none;
    padding: 5px 20px;
    cursor: pointer;
}
 
.popbox-mask{
    background-color:rgb(51, 51, 51);
    z-index:-1;
    opacity:0.57;
    filter:alpha(opacity=57);
    position:absolute;
    top:0;bottom:0;left:0;right:0;
}
 
.popbox-box{
    width:80%; 
    margin:0 auto; 
    background:#fff; 
    box-shadow: 0 0 10px #e5e5e5;
    border:1px solid #cfcece;
    margin-top:50px;
    height:400px;
    position: relative;
}
 
.popbox-header{
    font-size:16px; 
    background:#f5f5f5; 
    height:45px; 
    line-height:45px; 
    padding-left:10px; 
    border-bottom:1px solid #cfcece;
}
 
 
.popbox-close{
    background-image: url("data:img/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAclBMVEUAAABUbnpMZG9UbnpUbnpUbnpMZG9MZG9MZG9UbnpUbnpUbnpMZG9MZG9MZG9UbnpUbnpUbnpUbnpMZG9MZG9MZG9MZG9UbnpMZG9UbnpMZG9TbXlNZXBUbnpUbnpMZG9MZG9UbnpMZG9TbXhNZXD////JeuxdAAAAIXRSTlMAAAACCwEBCwJIrTExrUgKrMovL8qsCjAwLS3R0S7R0S4eePpJAAAAAWJLR0QlwwHJDwAAAHFJREFUKM+9kEUOgAAMBGlxd3f5/xsJRQMpN+ipmUkqKwg/FYiSDGuLiqrhwUE3TCCDaNkO7gZcr/eDxSCG0RAnh4DUJ0M8yvAyKyBDPDz5bvLizjdTVg++mLoZp7a7c1Zwo7jl3Lnsgy+RMCGysX9dMzEEC0NcbUT0AAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDE1LTA3LTI1VDIxOjUwOjE4KzA4OjAwovW56QAAACV0RVh0ZGF0ZTptb2RpZnkAMjAxNC0xMi0xMFQxNTo1Nzo0MSswODowMDXSSngAAABOdEVYdHNvZnR3YXJlAEltYWdlTWFnaWNrIDYuOC44LTEwIFExNiB4ODZfNjQgMjAxNS0wNy0xOSBodHRwOi8vd3d3LmltYWdlbWFnaWNrLm9yZwUMnDUAAAAYdEVYdFRodW1iOjpEb2N1bWVudDo6UGFnZXMAMaf/uy8AAAAYdEVYdFRodW1iOjpJbWFnZTo6SGVpZ2h0ADEyOEN8QYAAAAAXdEVYdFRodW1iOjpJbWFnZTo6V2lkdGgAMTI40I0R3QAAABl0RVh0VGh1bWI6Ok1pbWV0eXBlAGltYWdlL3BuZz+yVk4AAAAXdEVYdFRodW1iOjpNVGltZQAxNDE4MTk4MjYx8p3DWQAAABF0RVh0VGh1bWI6OlNpemUAOTQ0QkI71qP+AAAAWnRFWHRUaHVtYjo6VVJJAGZpbGU6Ly8vaG9tZS93d3dyb290L3d3dy5lYXN5aWNvbi5uZXQvY2RuLWltZy5lYXN5aWNvbi5jbi9zcmMvMTE4MTcvMTE4MTc1Ny5wbmc+xoIhAAAAAElFTkSuQmCC");
    width: 24px;
    height: 24px;
    position: absolute;
    top:10px;
    right:10px;
    cursor: pointer;
}